<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格标签</title>
</head>
<body>
    <table border="1">
        <caption>英雄列表</caption>
        <tr>
            <th>名字</th>
            <th>类型</th>
            <th>价格</th>
        </tr>
    </table>

<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script>
        //数据模型:属于
        let arr = [{name:"红眼",type:"鬼剑士",money:"1亿"},
            {name:"白手",type:"鬼剑士",money:"5千万"},
            {name:"乌鸡",type:"男格斗",money:"1千万"}];

        //遍历数组
        for(let i=0;i<arr.length;i++){
            let hero = arr[i];
            //创建tr,td
            let tr = $("<tr></tr>");
            let nametd = $("<td></td>");
            let typetd = $("<td></td>");
            let moneytd = $("<td></td>");
            nametd.text(hero.name);
            typetd.text(hero.type);
            moneytd.text(hero.money);
            //把td装进tr,把tr装进table
            tr.append(nametd);
            tr.append(typetd);
            tr.append(moneytd)
            $("table").append(tr);
        }
    </script>
</body>
</html>